var uiu = document.querySelector(".two2")
var soo = document.querySelector(".soo")
var xs = document.querySelector("#xs")
var lol = document.querySelector("#lol")
var pop = document.querySelector(".pop")
var opo = document.querySelector(".opo")
var lkl = document.querySelector("#lkl")
var jk = document.querySelector(".jk")
uiu.onclick = function() {
	soo.style.display = "block"
}
xs.onclick = function() {
	soo.style.display = "none"
}
lol.onclick = function() {
	pop.style.display = "block"
	opo.style.display = "none"
	jk.style.display = "none"
}
lkl.onclick = function() {
	opo.style.display = "none"
	jk.style.display = "block"
}
lol.onkeydown = function(e) {
	if (e.keyCode === 13) {
		opo.style.display = "none"
		jk.style.display = "block"
		pop.style.display = "none"
	}
}
var tyt = document.querySelectorAll(".tyt")
for (var q = 0; q < tyt.length; q++) {
	tyt[q].onclick = function() {
		var lol = document.querySelector("#lol")
		lol.value = this.innerHTML
		pop.style.display = "none"
		opo.style.display = "block"
	}

}

var lop = document.querySelector("#lop")
var loop = document.querySelector("#loop")
lop.onclick = function() {
	alert("最少购买一件")
}
loop.onclick = function() {
	alert("限购一件")
}

var acts = document.querySelector("#act")
var boxEr = document.querySelector(".box-er")
acts.onmouseover = function() {
	boxEr.setAttribute("style", "display:block;")
}
acts.onmouseleave = function() {
	boxEr.setAttribute("style", "display:none;")
}
var lefts = document.querySelector(".left")
var rights = document.querySelector(".right")
var imgs = document.querySelector(".imgs")
rights.onclick = function() {
	var lefts = getComputedStyle(imgs).left
	var leftNum = parseFloat(lefts) - 90
	imgs.style.left = leftNum + "px"
}
lefts.onclick = function() {
	var lefts = getComputedStyle(imgs).left
	var leftNum = parseFloat(lefts) + 90
	imgs.style.left = leftNum + "px"
}
var bigs = document.querySelector(".big")
var liImg = document.querySelectorAll(".imgs li")
for (var i = 0; i < liImg.length; i++) {
	liImg[i].onmouseover = function() {
		bigs.innerHTML = this.innerHTML
	}
}
var confi = document.querySelector(".confi")
var right1 = document.querySelector(".right1")
right1.onclick = function() {
	var leftss = getComputedStyle(confi).left
	var leftNums = parseFloat(leftss) - 90
	confi.style.left = leftNums + "px"
}

var color = document.querySelector("#color")
var nei = document.querySelector("#nei")
var hei = document.querySelector("#hei")
var bai = document.querySelector("#bai")
var lan = document.querySelector("#lan")
var sierjia = document.querySelector("#sierjia")
var wuyier = document.querySelector("#wuyier")
var bajia = document.querySelector("#bajia")
var guan = document.querySelector("#guan")
var xiang = document.querySelector("#xiang")
var sui = document.querySelector("#sui")
var yanyi = document.querySelector("#yanyi")
var yanban = document.querySelector("#yanban")
var care = document.querySelector("#care")
var quanq = document.querySelector("#quanq")
var quanh = document.querySelector("#quanh")
var colore = document.querySelector("#colore")
var neie = document.querySelector("#neie")
var jiage = document.querySelector("#jiage")
var lgl = document.querySelector("#lgl")
var lfl = document.querySelector("#lfl")
var bigimg = document.querySelector(".big")
hei.onclick = function() {
	hei.style.color = "red"
	hei.style.border = "1px solid red"
	bai.style.color = "rgba(0,0,0,0.5)"
	bai.style.border = "1px solid rgb(0,0,0,0.5)"
	lan.style.color = "rgba(0,0,0,0.5)"
	lan.style.border = "1px solid rgb(0,0,0,0.5)"
	color.innerHTML = hei.innerHTML
	colore.innerHTML = hei.innerHTML
	lgl.innerHTML = hei.innerHTML
	bigimg.innerHTML = `<img src="../img/findx5pro/findx5黑色的.png" alt="">`
}
bai.onclick = function() {
	bai.style.color = "red"
	bai.style.border = "1px solid red"
	hei.style.color = "rgba(0,0,0,0.5)"
	hei.style.border = "1px solid rgb(0,0,0,0.5)"
	lan.style.color = "rgba(0,0,0,0.5)"
	lan.style.border = "1px solid rgb(0,0,0,0.5)"
	color.innerHTML = bai.innerHTML
	colore.innerHTML = bai.innerHTML
	lgl.innerHTML = bai.innerHTML
	bigimg.innerHTML = `<img src="../img/findx5pro/findx5pro+2.png" alt="">`
}
lan.onclick = function() {
	lan.style.color = "red"
	lan.style.border = "1px solid red"
	bai.style.color = "rgba(0,0,0,0.5)"
	bai.style.border = "1px solid rgb(0,0,0,0.5)"
	hei.style.color = "rgba(0,0,0,0.5)"
	hei.style.border = "1px solid rgb(0,0,0,0.5)"
	color.innerHTML = lan.innerHTML
	colore.innerHTML = lan.innerHTML
	lgl.innerHTML = lan.innerHTML
	bigimg.innerHTML = `<img src="../img/findx5pro水蓝.png" alt="">`
}
sierjia.onclick = function() {
	nei.innerHTML = sierjia.innerHTML
	neie.innerHTML = sierjia.innerHTML
	lfl.innerHTML = sierjia.innerHTML
	sierjia.style.color = "red"
	sierjia.style.border = "1px solid red"
	wuyier.style.color = "rgba(0,0,0,0.5)"
	wuyier.style.border = "1px solid rgb(0,0,0,0.5)"
	bajia.style.color = "rgba(0,0,0,0.5)"
	bajia.style.border = "1px solid rgb(0,0,0,0.5)"
	quanq.innerHTML = 5499
	quanh.innerHTML = 5489
	jiage.innerHTML = 5489
}
wuyier.onclick = function() {
	nei.innerHTML = wuyier.innerHTML
	neie.innerHTML = wuyier.innerHTML
	lfl.innerHTML = wuyier.innerHTML
	wuyier.style.color = "red"
	wuyier.style.border = "1px solid red"
	sierjia.style.color = "rgba(0,0,0,0.5)"
	sierjia.style.border = "1px solid rgb(0,0,0,0.5)"
	bajia.style.color = "rgba(0,0,0,0.5)"
	bajia.style.border = "1px solid rgb(0,0,0,0.5)"
	quanq.innerHTML = 5999
	quanh.innerHTML = 5989
	jiage.innerHTML = 5989
}
bajia.onclick = function() {
	nei.innerHTML = bajia.innerHTML
	neie.innerHTML = bajia.innerHTML
	lfl.innerHTML = bajia.innerHTML
	bajia.style.color = "red"
	bajia.style.border = "1px solid red"
	wuyier.style.color = "rgba(0,0,0,0.5)"
	wuyier.style.border = "1px solid rgb(0,0,0,0.5)"
	sierjia.style.color = "rgba(0,0,0,0.5)"
	sierjia.style.border = "1px solid rgb(0,0,0,0.5)"
	quanq.innerHTML = 5199
	quanh.innerHTML = 4689
	jiage.innerHTML = 4689
}
guan.onclick = function() {
	guan.style.color = "red"
	guan.style.border = "1px solid red"
	xiang.style.color = "rgba(0,0,0,0.5)"
	xiang.style.border = "1px solid rgb(0,0,0,0.5)"
}
xiang.onclick = function() {
	xiang.style.color = "red"
	xiang.style.border = "1px solid red"
	guan.style.color = "rgba(0,0,0,0.5)"
	guan.style.border = "1px solid rgb(0,0,0,0.5)"
}
sui.onclick = function() {
	sui.classList.toggle("act")
}
yanyi.onclick = function() {
	yanyi.style.color = "red"
	yanyi.style.border = "1px solid red"
	yanban.style.color = "rgba(0,0,0,0.5)"
	yanban.style.border = "1px solid rgb(0,0,0,0.5)"
}
yanban.onclick = function() {
	yanban.style.color = "red"
	yanban.style.border = "1px solid red"
	yanyi.style.color = "rgba(0,0,0,0.5)"
	yanyi.style.border = "1px solid rgb(0,0,0,0.5)"
}
care.onclick = function() {
	care.classList.toggle("act")
}
var sum = document.querySelector("#sum")
var btnj = document.querySelector(".btnj")
btnj.onclick = function() {
	sum.innerHTML = 1
}


var fan = document.querySelector(".fanhui")
var ification1 = document.querySelector(".ification1")
var xiangqins = document.querySelector("#xiangqins")
var cansu = document.querySelector("#cansu")
var remen = document.querySelector("#remen")
var pinjia = document.querySelector("#pinjia")
var xiangqing = document.querySelector("#xiangqing")
var cansug = document.querySelector("#cansug")
var remeng = document.querySelector("#remeng")
var pinjiag = document.querySelector("#pinjiag")
window.onscroll = function() {
	var hights = document.documentElement.scrollTop || document.body.scrollTop
	if (hights >= 500) {
		fan.style.display = "block"
	} else {
		fan.style.display = "none"
	}
	if (hights >= 2000) {
		ification1.style.display = "block"
	} else {
		ification1.style.display = "none"
	}
	if (hights >= 24000) {
		cansu.style.color = "red"
		cansu.style.paddingBottom = "17px"
		cansu.style.borderBottom = "1px solid red"
		xiangqins.style.color = ""
		xiangqins.style.borderBottom = "none"

	} else {
		cansu.style.color = ""
		cansu.style.borderBottom = "none"
		xiangqins.style.color = "red"
		xiangqins.style.borderBottom = "1px solid red"

	}
	if (hights >= 34900) {
		pinjia.style.color = "red"
		pinjia.style.paddingBottom = "17px"
		pinjia.style.borderBottom = "1px solid red"
		cansu.style.color = ""
		cansu.style.borderBottom = "none"
	} else {
		pinjia.style.color = ""
		pinjia.style.borderBottom = "none"
	}
	if (hights >= 35600) {
		remen.style.color = "red"
		remen.style.paddingBottom = "17px"
		remen.style.borderBottom = "1px solid red"
		pinjia.style.color = ""
		pinjia.style.borderBottom = "none"
	} else {
		remen.style.color = ""
		remen.style.borderBottom = "none"
	}
}
fan.addEventListener("click", () => {
	document.documentElement.scrollTop = 0
	document.body.scrollTop = 0
})

xiangqing.addEventListener("click", () => {
	document.documentElement.scrollTop = 1880
	document.body.scrollTop = 1880
})
cansug.addEventListener("click", () => {
	document.documentElement.scrollTop = 24000
	document.body.scrollTop = 24000
})
pinjiag.addEventListener("click", () => {
	document.documentElement.scrollTop = 35000
	document.body.scrollTop = 35000
})
remeng.addEventListener("click", () => {
	document.documentElement.scrollTop = 35600
	document.body.scrollTop = 35600
})

xiangqins.addEventListener("click", () => {
	document.documentElement.scrollTop = 1800
	document.body.scrollTop = 1800
})

cansu.addEventListener("click", () => {
	document.documentElement.scrollTop = 24000
	document.body.scrollTop = 24000
})
pinjia.addEventListener("click", () => {
	document.documentElement.scrollTop = 35000
	document.body.scrollTop = 35000
})
remen.addEventListener("click", () => {
	document.documentElement.scrollTop = 35600
	document.body.scrollTop = 35600
})
